import React, { memo } from 'react'
import { AlbumCoverWrapper } from './style'
import { formatImg } from '@/utils/format'
import useShowAlbumDetail from '@/hooks/useShowAlbumDetail'
export default memo(function AlbumCover(props) {
  const { info } = props
  const goToAlbumDetail = useShowAlbumDetail()
  return (
    <AlbumCoverWrapper>
      <img src={formatImg(info.picUrl,100)} alt="" className="image"/>
      <div className="mask sprite_covor" onClick={e => goToAlbumDetail(info.id)}></div>
      <div className="name text-nowrap">{info.name}</div>
      <div className="artist text-nowrap">{info.artist.name}</div>
    </AlbumCoverWrapper>
  )
})
